<!DOCTYPE html>
<html lang="en">


<head>
    <meta charset="utf-8">
    <title>PROFILE</title>
    <link rel="stylesheet" type="text/css" href="css/common.css">
    <link rel="stylesheet" href="css/register.css">
    <!--导入jquery-->
    <script src="js/jquery-3.3.1.js"></script>
    <script src="js/getParameter.js"></script>

    <script src="vue/vue.min.js"></script>
    <link rel="stylesheet" href="vue/iview.css">
    <script src="vue/iview.min.js"></script>

</head>
<body>
<div id="profileDemo">
    <!--引入头部-->
    <div id="header"></div>

    <!-- 头部 end -->
    <div class="rg_layout">
        <div class="rg_form clearfix">
            <div class="rg_form_left">
                <p>PROFILE</p>
            </div>
            <div class="rg_form_center">
                <div id="errorMsg" style="color: red;text-align: center"></div>
                <!--注册表单-->
                <form id="registerForm" action="user" method="post">
                    <table style="margin-top: -100px;">
                        <tr>
                            <td class="td_left">
                                <label>Username</label>
                            </td>
                            <td class="td_right">
                                <input type="text" id="username" name="username" v-model="username" readonly/>
                            </td>
                        </tr>
                        <br>
                        <br>
                        <tr>
                            <td class="td_left">
                                <label>First Name</label>
                            </td>
                            <td class="td_right">
                                <input type="text" id="firstname" name="firstname" v-model="firstname" readonly/>
                            </td>
                        </tr>
                        <br>
                        <tr>
                            <td class="td_left">
                                <label for="lastname">Last Name</label>
                            </td>
                            <td class="td_right">
                                <input type="text" name="lastname" id="lastname" v-model="lastname" readonly/>
                            </td>
                        </tr>


                        <tr>
                            <td class="td_left">
                                <label>Email</label>
                            </td>
                            <td class="td_right">
                                <input type="text" id="email" name="email" v-model="email" readonly>
                            </td>
                        </tr>

                        <tr>
                            <td class="td_left">
                                <label for="telephone">Phone Number</label>
                            </td>
                            <td class="td_right">
                                <input type="text" id="telephone" name="telephone" v-model="telephone" readonly>
                            </td>
                        </tr>

                        <br>
                        <tr>
                            <td class="td_left">
                                <label for="sex">Sex</label>
                            </td>
                            <td class="td_right check">
                                <input type="text" id="sex" name="sex" v-model="sex" readonly>
                                <!--                            <p id="sex" >Male</p>-->
                            </td>
                        </tr>
                        <!--                    <tr>-->
                        <!--                        <td class="td_left">-->
                        <!--                            <label for="pw">Pay way</label>-->
                        <!--                        </td>-->
                        <!--                        <td class="td_right check">-->
                        <!--                            <input type="text" id="pw" name="pw" value="Wechat" readonly>-->
                        <!--                        </td>-->
                        <!--                    </tr>-->

                    </table>
                </form>
            </div>
        </div>
    </div>
    <!--引入尾部-->
    <div id="footer"></div>
</div>
<!--导入布局js，共享header和footer-->
<script type="text/javascript" src="js/include.js"></script>
<script type="text/javascript">
    new Vue({
        el: '#profileDemo',
        data() {
            return {
                username: '',
                firstname: '',
                lastname: '',
                email: '',
                telephone:'',
                sex:'',
                uid: '',
                id: '',
                user: ''
            }
        },

        created() {
            let un = getParameter("username");
            let url = 'course/getUserInfo';
            $.post(url, {un: un}, (resp) => {
                this.username = resp.username;
                this.firstname = resp.firstname;
                this.lastname = resp.lastname;
                this.email = resp.email;
                this.telephone = resp.telephone;
                this.sex = resp.sex;
            }, 'json');

        },

        methods: {},

        mounted() {
        }
    });
</script>
</body>
</html>